<template>
  <view class="pageZ">
	  <template v-if="showKefu">
	  	<view class="user-adver s-flex-c-c-c">
	  		<image class="image" src="/static/img/user/adver.png" @click="handleMakePhone"></image>
	  	</view>
	  </template>
	  <template v-else>
    <up-navbar title="" :autoBack="false" safeAreaInsetTop placeholder>
      <template #left>
        <view class="u-nav-slot">
          <image
            style="
              width: 80rpx;
              height: 40rpx;
              margin-right: 10rpx;
              vertical-align: middle;
            "
            src="/static/img/index/gg.png"
            mode=""></image>
          <!-- 港中盈 -->
        </view>
      </template>
    </up-navbar>
    <view
      class="list"
      v-for="(item, index) in indexList"
      :key="index"
      @click="handleDetail(item)">
      <view class="time" v-if="item.createtime">{{ item.createtime }}</view>
      <view class="box">
        <view class="imgBox">
          <image class="img" :src="item.image" mode=""></image>
          <!-- <view class="title">{{ item.name }}</view> -->
        </view>
       <view class="bottom">
          <view class="desc">
            {{ item.name }}
          </view>
          <!-- <image class="bottomImg" :src="item.image" mode=""></image> -->
        </view>
        <!-- <view class="bottom">
          <view class="desc">
            因为这5个原因，高净值家庭一定要有香港身份！因为这5个原因，高净值家庭一定要有香港身份！
          </view>
          <image
            class="bottomImg"
            src="/static/img/index/index-g1.png"
            mode=""></image>
        </view> -->
      </view>
    </view>
	</template>
  </view>
</template>

<script setup>
import { ref, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const lineBg =
  "";
const tab2list = ref([]);
const tab2 = ref(0);
const showKefu = ref(false);
const params = ref({
  page: 1,
  per_page: 10,
});
const indexList = ref([]);
function getControlNum() {
  proxy
    .$request({
      url: "api/Config/getWechatVersionConfig",
      header: "application/x-www-form-urlencoded",
      data: {},
    })
    .then((res) => {
      if (res.code == 1 && res.data ==  proxy.$num) {
		  showKefu.value=true
      } else {
      }
    });
}
getControlNum();
function getTabData() {
  proxy
    .$request({
      url: "api/consult/consultSort",
      header: "application/x-www-form-urlencoded",
      data: {},
    })
    .then((res) => {
      if (res.code == 0) {
        return proxy.$toast(res.msg);
      } else {
        tab2list.value = res.data.list;
        tab2.value = tab2list.value[0].id;
        getListData();
      }
    });
}
getTabData();

function getListData() {
  proxy
    .$request({
      url: "api/consult/consultManage",
      header: "application/x-www-form-urlencoded",
      data: {
        consult_sort_id: tab2.value,
        page: params.value.page,
        per_page: params.value.per_page,
      },
    })
    .then((res) => {
      if (res.code == 0) {
        return proxy.$toast(res.msg);
      } else {
        indexList.value = res.data.list;
      }
    });
}
function handleMakePhone() {
		uni.makePhoneCall({
			phoneNumber: '4009996666'
		})
	}
function tabHandle2(i) {
  tab2.value = i.id;
  getListData();
}
const onLoad = () => {
  loadmore();
};

const scrolltolower = () => {
  loadmore();
};

const loadmore = () => {};

function handleDetail(item) {
  uni.navigateTo({
    url: `/pages/zixun/details?id=${item.id}&title=${item.name}`,
  });
}

const art1 = ref({});

function getSingleData() {
  proxy
    .$request({
      url: "api/consult/single",
      header: "application/x-www-form-urlencoded",
      data: {
        // 1用户协议,2隐私协议3商会介绍4会员介绍 6港中盈的介绍内容
        type_id: 6,
      },
    })
    .then((res) => {
      if (res.code == 0) {
        return proxy.$toast(res.msg);
      } else {
        art1.value = res.data.details;
      }
    });
}
getSingleData();
</script>

<style lang="scss" scoped>
.pageZ {
  background: #f8f8f8;
  padding: 0 32rpx;
  box-sizing: border-box;
}

.list {
  width: 100%;
  padding: 10rpx 32rpx 30px;
  box-sizing: border-box;
  // background: #ffffff;
  border-radius: 16rpx 16rpx 16rpx 16rpx;
  margin-top: 20rpx;

  .time {
    text-align: center;
    color: #999;
    font-size: 24rpx;
    margin-bottom: 20rpx;
  }

  .box {
    background: #fff;
    padding-bottom: 30rpx;

    .imgBox {
      position: relative;
      height: 272rpx;

      .img {
        width: 100%;
        height: 272rpx;
        border-radius: 8rpx 8rpx 8rpx 8rpx;
        position: absolute;
      }

      .title {
        position: absolute;
        color: #fff;
        bottom: 0;
        padding: 0 30rpx;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        text-overflow: ellipsis;
        overflow: hidden;
        margin-bottom: 20rpx;
      }
    }

    .bottom {
      display: flex;
      justify-content: space-between;
      padding: 20rpx;
      box-sizing: border-box;
      padding-bottom: 0;

      .desc {
        line-height: 48rpx;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        overflow: hidden;
      }

      .bottomImg {
        width: 104rpx;
        height: 104rpx;
        border-radius: 8rpx 8rpx 8rpx 8rpx;
        flex-shrink: 0;
        margin-left: 20rpx;
      }
    }
  }
}

.article {
  margin-top: 18rpx;
  background: #ffffff;
  padding: 50rpx 32rpx;

  .box {
    .box-tit {
      margin: 8rpx 0;

      .icon {
        width: 32rpx;
        height: 32rpx;
        margin-right: 16rpx;
      }

      .tit {
        font-weight: 800;
        font-size: 32rpx;
        color: #333333;
        line-height: 44rpx;
        width: 184rpx;
        height: 84rpx;
        background: url(https://oss.bigchun.com/img/gangzhongying/index-i-bg.png)
          74rpx 0rpx no-repeat;
        background-size: 124rpx 84rpx;
      }
    }

    .content {
      padding: 10rpx 0;
      font-weight: 400;
      font-size: 28rpx;
      color: #000000;
      line-height: 44rpx;
      text-align: left;
    }
  }
}
.user-adver {
			padding-top: 100rpx;

			.image {
				width: 686rpx;
				height: 158rpx;
			}
		}
</style>
